<!DOCTYPE html>
<html lang="en">
<head>

    <title>Parallax Template</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="" />
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    
    
    <link href="css/bootstrap.min.css" rel="stylesheet" />    
    <link href="style.css" rel="stylesheet" />
    
    
	<link rel="alternate stylesheet" type="text/css" href="css/colors/color-gray.css" title="gray">
    <link rel="alternate stylesheet" type="text/css" href="css/colors/color-green.css" title="green">
    <link rel="alternate stylesheet" type="text/css" href="css/colors/color-red.css" title="red">
    <link rel="alternate stylesheet" type="text/css" href="css/colors/color-blue.css" title="blue">
    <link rel="alternate stylesheet" type="text/css" href="css/colors/color-yellow.css" title="yellow">
    
    
    <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" />    
	<link href="css/jquery.bxslider.css" rel="stylesheet" />
    <link href="css/font-awesome.min.css" rel="stylesheet" />
    <link rel="icon" type="image/ico" href="favicon.ico" />
    <link href='http://fonts.useso.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css' />    
    <link href='http://fonts.useso.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
   
</head>

<body data-spy="scroll" data-target=".navbar" data-offset="75">


	
	
	<!-- Preloader -->
	<div class="mask"><div id="loader"></div></div>
	<!--/Preloader -->
    
    
    
    
    
	<!-- Navigation -->
    <div id="navigation-sticky-wrapper" class="sticky-wrapper is-sticky" style="height: 45px;">
        <div class="navbar navbar-fixed-top is-sticky" id="navigation" style="position: fixed; top: 0px;">
            <div class="navbar-inner ">
                <div class="container no-padding">
                
                    <a class="show-menu" data-toggle="collapse" data-target=".nav-collapse">
                        <span class="show-menu-bar"></span>
                    </a>
                    
                    <div id="logo"><a class="external" href="index.html"></a></div>
                    <div class="nav-collapse collapse">
                        <ul class="nav">
                            <li class="menu-1"><a class="colapse-menu1 external" href="index.html#home">Home</a></li>
                            <li class="menu-2"><a class="colapse-menu1 external" href="index.html#we-are-newave">About</a></li>
                            <li class="menu-3"><a class="colapse-menu1 external" href="index.html#services">Services</a></li>
                            <li class="menu-4"><a class="colapse-menu1 external" href="index.html#clients">Clients</a></li>
                            <li class="menu-5"><a class="colapse-menu1 external" href="index.html#portfolio">Portfolio</a></li>
                            <li class="menu-6"><a class="colapse-menu1 external" href="index.html#contact-parallax">Contact</a></li>
                            <li class="dropdown menu-7"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Blog</a>
                                <ul class="dropdown-menu">
                                  <li><a class="external" href="blog.html">Blog standard</a></li>
                                  <li><a class="external" href="blog-masonry.html">Blog Masonry</a></li>
                                  <li><a class="external" href="blog-post.html">Blog post page </a></li>
								  <li><a class="external" href="http://www.weidea.net">weidea.net </a></li>
                                </ul>
                            </li>
                            <li class="menu-8 active"><a class="external" href="shortcodes.html">Shortcodes</a></li>
                        </ul>
                    </div>
                </div>
            </div>
		</div>
	</div>
    <!--/Navigation -->
    
    
    
    
    
    
    
    
    <!-- Shortcodes -->    
    <section>
    
        <!-- Container -->
        <div class="container small-width">
        
        
            <!-- Section Title -->
            <div class="section-title">
                <h1>Shortcodes</h1>
                <span class="border"></span>
                <p>Create your unique looking website with our shortcodes and elements that we offers you!</p>
            </div>				
            <!--/Section Title -->
            
            
            
            
            
            
            <!-- Recent Posts -->
            <h4 class="title-divider">Pricing Tables</h4>
            
            
            
            <div class="pricing-tables">

        

        
            <div class="price-table">
                <i class="fa fa-dashboard"></i>
                <ul>
                    <li><h3>Standard</h3></li>
                    <li class="pricetable-price"><h3>$19.99</h3><span>PER MONTH</span></li>
                    <li>5 GB Storage</li>
                    <li>Free Live Support</li>
                    <li>Unlimited Users</li>
                    <li><a class="newave-button medium grey rounded" href="#">Sign Up</a></li>
                </ul>
            </div><!--./services-->
        

        
            <div class="price-table">
                <i class="fa fa-sitemap"></i>
                <ul class="services-info">
                    <li><h3>Premium</h3></li>
                    <li class="pricetable-price"><h3>$39.99</h3><span>PER MONTH</span></li>
                    <li>5 GB Storage</li>
                    <li>Free Live Support</li>
                    <li>Unlimited Users</li>
                    <li><a class="newave-button medium grey rounded" href="#">Sign Up</a></li>
                </ul>
            </div><!--./services-->
        

        
            <div class="price-table">
                <i class="fa fa-cogs"></i>
                <ul class="services-info">
                    <li><h3>Professional</h3></li>
                    <li class="pricetable-price"><h3>$69.99</h3><span>PER MONTH</span></li>
                    <li>5 GB Storage</li>
                    <li>Free Live Support</li>
                    <li>Unlimited Users</li>
                    <li><a class="newave-button medium grey rounded" href="#">Sign Up</a></li>
                </ul>
            </div><!--./services-->


 
            <div class="price-table">
                <i class="fa fa-inbox"></i>
                <ul class="services-info">
                    <li><h3>Ultimate</h3></li>
                    <li class="pricetable-price"><h3>$99.99</h3><span>PER MONTH</span></li>
                    <li>5 GB Storage</li>
                    <li>Free Live Support</li>
                    <li>Unlimited Users</li>
                    <li><a class="newave-button medium grey rounded" href="#">Sign Up</a></li>
                </ul>
            </div><!--./services-->
 

        

    </div>
            
            
            
            
            
            
            
            
            
            
            
            <!-- Recent Posts -->
            <h4 class="title-divider">Recent Posts</h4>
            
            
            <div class="recent-post">
            
            	<p class="recent-post-date">13 November 2013</p>
            
            	<div class="blog-type"><img alt="" src="images/blog-gallery.png"></div>
                
                <h5 class="blog-title"><a class="external" href="blog-post.html">Blog post with gallery</a></h5>
            
            	<p class="blog-meta">Posted by <a href="#">Admin</a> | <a href="#">Design</a> | <a href="#">5 Comments</a></p>
            
            </div>
            
            
            <div class="recent-post">
            
            	<p class="recent-post-date">13 November 2013</p>
            
            	<div class="blog-type"><img alt="" src="images/blog-video.png"></div>
                
                <h5 class="blog-title"><a class="external" href="blog-post.html">Embed video blog post format</a></h5>
            
            	<p class="blog-meta">Posted by <a href="#">Admin</a> | <a href="#">Video</a> | <a href="#">5 Comments</a></p>
            
            </div>
            
            
            <div class="recent-post">
            
            	<p class="recent-post-date">13 November 2013</p>
            
            	<div class="blog-type"><img alt="" src="images/blog-quote.png"></div>
                
                <h5 class="blog-title"><a class="external" href="blog-post.html">"Art is the only serious thing [..]</a></h5>
            
            	<p class="blog-meta">Posted by <a href="#">Admin</a> | <a href="#">Quote</a> | <a href="#">5 Comments</a></p>
            
            </div>
            
            
            <div class="recent-post">
            
            	<p class="recent-post-date">13 November 2013</p>
            
            	<div class="blog-type"><img alt="" src="images/blog-text.png"></div>
                
                <h5 class="blog-title"><a class="external" href="blog-post.html">Blog post with text only</a></h5>
            
            	<p class="blog-meta">Posted by <a href="#">Admin</a> | <a href="#">Text</a> | <a href="#">5 Comments</a></p>
            
            </div>
            
            
            <div class="recent-post">
            
            	<p class="recent-post-date">13 November 2013</p>
            
            	<div class="blog-type"><img alt="" src="images/blog-image.png"></div>
                
                <h5 class="blog-title"><a class="external" href="blog-post.html">One image blog post</a></h5>
            
            	<p class="blog-meta">Posted by <a href="#">Admin</a> | <a href="#">Image</a> | <a href="#">5 Comments</a></p>
            
            </div>
            <!-- Recent Posts -->
     
            
            
            
            <!-- Accordions -->
            <h4 class="title-divider">Accordions</h4>
            
            
            <dl class="accordion">
                <dt><span class="accordion-status"></span><span>Accordion 1</span></dt>
                
                <dd class="accordion-content">Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</dd>
                
                <dt><span class="accordion-status"></span><span>Accordion 2</span></dt>
                
                <dd class="accordion-content">Nulla sagittis augue nec orci vestibulum, vel dapibus lorem dignissim. Suspendisse potenti. Quisque vehicula arcu eget libero venenatis ultricies.</dd>
                
                <dt><span class="accordion-status"></span><span>Accordion 3</span></dt>
                
                <dd class="accordion-content">Donec blandit ultrices condimentum. Aliquam fermentum commodo magna, id pretium nisi elementum at. Nulla molestie, ligula in fringilla rhoncus, risus leo dictum est, nec egestas nunc sem tincidunt turpis.</dd>
                
                <dt><span class="accordion-status"></span><span>Accordion 4</span></dt>
                
                <dd class="accordion-content">Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</dd>
            </dl>
            <!--/Accordions -->
            
            
            
            
            <!-- Toggles -->
            <h4 class="title-divider">Toggles</h4>        
            
            
            <div class="toggle-wrap">        
                <span class="toggle-title"><a href="#">FAQ Toggle 1</a></span>            
                <div class="toggle_container">Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</div>            
            </div>
            
            <div class="toggle-wrap">        
                <span class="toggle-title"><a href="#">FAQ Toggle 2</a></span>        
                <div class="toggle_container">Nulla sagittis augue nec orci vestibulum, vel dapibus lorem dignissim. Suspendisse potenti. Quisque vehicula arcu eget libero venenatis ultricies.</div>        
            </div>
            
            <div class="toggle-wrap">
                <span class="toggle-title"><a href="#">FAQ Toggle 3</a></span>
                <div class="toggle_container">Donec blandit ultrices condimentum. Aliquam fermentum commodo magna, id pretium nisi elementum at. Nulla molestie, ligula in fringilla rhoncus, risus leo dictum est, nec egestas nunc sem tincidunt turpis.</div>
            </div>
            <!--/Toggles -->        
            
            
            
            
            <!-- Tabs --> 
            <h4 class="title-divider">Tabs</h4>        
            
            
            <div class="tab-shortcode">
                <ul class="clearfix tabs">
                    <li><a href="#tabs-1">Tab One</a></li>
                    <li><a href="#tabs-2">Tab Two</a></li>
                    <li><a href="#tabs-3">Tab Three</a></li>
                </ul>
                <div id="tabs-1" class="tab_container">Donec blandit ultrices condimentum. Aliquam fermentum commodo magna, id pretium nisi elementum at. Nulla molestie, ligula in fringilla rhoncus, risus leo dictum est, nec egestas nunc sem tincidunt turpis.</div>
                <div id="tabs-2" class="tab_container">Nulla sagittis augue nec orci vestibulum, vel dapibus lorem dignissim. Suspendisse potenti. Quisque vehicula arcu eget libero venenatis ultricies.</div>
                <div id="tabs-3" class="tab_container">Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. 3</div>
            </div>
            <!--/Tabs --> 
            
            
            
            
            <!-- Blockquote --> 
            <h4 class="title-divider">Blockquote</h4>
            
            
            <div class="one_half">
                <blockquote>Donec volutpat nibh sit amet libero ornare non laoreet arcu luctus. Donec id arcu quis mauris euismod placerat sit amet ut metus. Sed imperdiet fringilla sem eget euismod.</blockquote>
            </div>
            
            <div class="one_half last">                    
                <blockquote>Donec volutpat nibh sit amet libero ornare non laoreet arcu luctus. Donec id arcu quis mauris euismod placerat sit amet ut metus. Sed imperdiet fringilla sem eget euismod.</blockquote>         
            </div>
            <!--/Blockquote --> 
            
            
            
            
            <!-- DropCaps --> 
            <h4 class="title-divider">Dropcaps</h4>
            
            
            <div class="one_third">        
                <p><span class="dropcap-normal">A</span> vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis top praesentium voluptatum delen  molestias excepturi sint occaecati cupiditate non provident, similique sunt culpa.</p>        
            </div>
            
            <div class="one_third">        
                <p><span class="dropcap round dark">B</span> vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis top praesentium voluptatum delen  molestias excepturi sint occaecati cupiditate non provident, similique sunt culpa.</p>        
            </div>
            
            <div class="one_third last">        
                <p><span class="dropcap square dark">E</span>ros et accusamus et iusto odio dignissimos ducimus qui blanditiis top praesentium voluptatum delen  molestias excepturi sint occaecati cupiditate non provident, similique sunt culpa.</p>        
            </div>
            <!--/DropCaps --> 
            
            
            
            
            <!-- Skill Bars --> 
            <h4 class="title-divider">Skill Bars</h4>        
            
            
            <div class="one_half">
                    
                    <!-- Progress Bar -->
					<div class="skills">
						<ul class="bar">
                        
                            <li>
                                <div class="bar-wrap"><span data-width="80"><strong>Brand Identity 80%</strong></span></div>
                            </li> 
                            <li>                                    
                                <div class="bar-wrap"><span data-width="100"><strong>Mobile & Web Design 100%</strong></span></div>
                            </li>
                            <li>
                                <div class="bar-wrap"><span data-width="70"><strong>User Experience 70%</strong></span></div>
                            </li>
                             
						</ul>
					</div>	
					<!--/Progress Bar -->
                    
                    </div>
                    
                    
                    
                    <div class="one_half last">
                    
                    <!-- Progress Bar -->
					<div class="skills">
						<ul class="bar">
                             
                            <li>
                                <div class="bar-wrap"><span data-width="70"><strong>iOS Development 70%</strong></span></div>
                            </li> 
                            <li>
                                <div class="bar-wrap"><span data-width="90"><strong>Photography 90%</strong></span></div>
                            </li>
                            <li>
                                <div class="bar-wrap"><span data-width="80"><strong>Video Production 80%</strong></span></div>
                            </li>
                             
						</ul>
					</div>	
					<!--/Progress Bar -->
                    
                    </div>
            <!--/Skill Bars -->
            
            
            
            
            <!-- Animated Milestone Counters --> 
            <h4 class="title-divider">Animated Milestone Counters</h4>
            
            
            <div class="counters">
                
                    <div class="one_fourth">
                        <ul><li class="timer" data-perc="1300"><i class="fa fa-thumbs-up"></i><span class="count">300</span> likes</li></ul>
                    </div>
                    
                    <div class="one_fourth">
                        <ul><li class="timer" data-perc="100"><i class="fa fa-rocket"></i><span class="count">100</span> projects</li></ul>
                    </div>
                    
                    <div class="one_fourth">
                        <ul><li class="timer" data-perc="60"><i class="fa fa-briefcase"></i><span class="count">60</span> clients</li></ul>
                    </div>
                    
                    <div class="one_fourth last">
                        <ul><li class="last timer" data-perc="20"><i class="fa fa-trophy"></i><span class="count">20</span> awards</li></ul>
                    </div>
                
            </div>
            <!--/Animated Milestone Counters --> 
            
            
            
            
            <!-- Buttons --> 
            <h4 class="title-divider">Buttons</h4>
            
            
            <div class="one_fourth">
                <a href="#" class="newave-button small grey">Small</a>
                <br><br>            
                <a href="#" class="newave-button medium grey">Medium</a>
                <br><br>            
                <a href="#" class="newave-button large grey">Largest</a>
            </div>
            
            <div class="one_fourth">                        
                <a href="#" class="newave-button small grey rounded">Small</a>
                <br><br>            
                <a href="#" class="newave-button medium grey rounded">Medium</a>
                <br><br>            
                <a href="#" class="newave-button large grey rounded">Largest</a>
            </div>
            
            <div class="one_fourth">                        
                <a href="#" class="newave-button small outline">Small</a>
                <br><br>            
                <a href="#" class="newave-button medium outline">Medium</a>
                <br><br>            
                <a href="#" class="newave-button large outline">Largest</a>
            </div>
            
            <div class="one_fourth last">                        
                <a href="#" class="newave-button small outline rounded">Small</a>
                <br><br>            
                <a href="#" class="newave-button medium outline rounded">Medium</a>
                <br><br>            
                <a href="#" class="newave-button large outline rounded">Largest</a>
            </div>
            <!--/Buttons -->
           
           
           
           
            <!-- Alert Boxes -->
            <h4 class="title-divider">Alert Boxes</h4>
            
            
            <div class="alertboxes">
                <div class="shortcode_alertbox box_red">
                    <b>Red Message Box.</b> Praesent tempor vestibulum eros at bibendum aenean eu augue pellentesque risus! 
                    <a class="box_close"></a>
                </div>
            </div>
            
            <div class="alertboxes">
                <div class="shortcode_alertbox box_blue">
                    <b>Blue Message Box.</b> Praesent tempor vestibulum eros at bibendum aenean eu augue pellentesque risus! 
                    <a class="box_close"></a>
                </div>
            </div>
            
            <div class="alertboxes">
                <div class="shortcode_alertbox box_yellow">
                    <b>Yellow Message Box.</b> Praesent tempor vestibulum eros at bibendum aenean eu augue pellentesque risus! 
                    <a class="box_close"></a>
                </div>
            </div>
            
            <div class="alertboxes">
                <div class="shortcode_alertbox box_green">
                    <b>Green Message Box.</b> Praesent tempor vestibulum eros at bibendum aenean eu augue pellentesque risus! 
                    <a class="box_close"></a>
                </div>
            </div>
            <!--/Alert Boxes -->
            
            
            
            
            <!-- Lists Styles -->
            <h4 class="title-divider">Lists Styles</h4>
            
            
            <div class="one_fourth">            
                <ul class="fa-ul">
                    <li><i class="fa-li fa fa-check"></i>Nullam dignissim convallis</li>
                    <li><i class="fa-li fa fa-check"></i>Proin porttitor in ultrices</li>
                    <li><i class="fa-li fa fa-check"></i>Nullam dignissim convallis</li>
                </ul>
            </div>
            
            <div class="one_fourth">            
                <ul class="fa-ul">
                    <li><i class="fa-li fa fa-star"></i>Nullam dignissim convallis</li>
                    <li><i class="fa-li fa fa-star"></i>Proin porttitor in ultrices</li>
                    <li><i class="fa-li fa fa-star"></i>Nullam dignissim convallis</li>
                </ul>
            </div>
            
            <div class="one_fourth">            
                <ul class="fa-ul">
                    <li><i class="fa-li fa fa-angle-double-right"></i>Nullam dignissim convallis</li>
                    <li><i class="fa-li fa fa-angle-double-right"></i>Proin porttitor in ultrices</li>
                    <li><i class="fa-li fa fa-angle-double-right"></i>Nullam dignissim convallis</li>
                </ul>
            </div>
            
            <div class="one_fourth last">            
                <ul class="fa-ul">
                    <li><i class="fa-li fa fa-caret-right"></i>Nullam dignissim convallis</li>
                    <li><i class="fa-li fa fa-caret-right"></i>Proin porttitor in ultrices</li>
                    <li><i class="fa-li fa fa-caret-right"></i>Nullam dignissim convallis</li>
                </ul>
            </div>
            <!--/Lists Styles -->
    
    
    
    
            <!-- Social Icons -->
            <h4 class="title-divider">Social Icons</h4>
            
            
            <ul class="socials-icons">
                <li><a href="#"><img src="images/facebook.png" alt="" /></a></li>
                <li><a href="#"><img src="images/twitter.png" alt="" /></a></li>
                <li><a href="#"><img src="images/google.png" alt="" /></a></li>
                <li><a href="#"><img src="images/dribble.png" alt="" /></a></li>
				<li><a href="#"><img src="images/vimeo.png" alt="" /></a></li>
                <li><a href="#"><img src="images/youtube.png" alt="" /></a></li>
                <li><a href="#"><img src="images/flickr.png" alt="" /></a></li>
                <li><a href="#"><img src="images/skype.png" alt="" /></a></li>
                <li><a href="#"><img src="images/rss.png" alt="" /></a></li>
                <li><a href="#"><img src="images/stumble.png" alt="" /></a></li>
                <li><a href="#"><img src="images/lastfm.png" alt="" /></a></li>
                <li><a href="#"><img src="images/pinterest.png" alt="" /></a></li>
                <li><a href="#"><img src="images/behance.png" alt="" /></a></li>
                <li><a href="#"><img src="images/linkedin.png" alt="" /></a></li>
                <li><a href="#"><img src="images/deviantart.png" alt="" /></a></li>
                <li><a href="#"><img src="images/picasa.png" alt="" /></a></li>
            </ul>
            <!--/Social Icons -->
            
            
            
            
            <!-- Font Awesome Icons -->
            <h4 class="title-divider">Font Awesome Icons</h4>
            
            
            <div class="one_fourth">        
                <ul class="the-icons">
                    <li><i class="fa fa-adjust"></i> fa fa-adjust</li>
                    <li><i class="fa fa-asterisk"></i> fa fa-asterisk</li>
                    <li><i class="fa fa-ban"></i> fa fa-ban</li>
                    <li><i class="fa fa-bar-chart-o"></i> fa fa-bar-chart-o</li>
                    <li><i class="fa fa-barcode"></i> fa fa-barcode</li>
                    <li><i class="fa fa-flask"></i> fa fa-flask</li>
                    <li><i class="fa fa-beer"></i> fa fa-beer</li>
                    <li><i class="fa fa-bell"></i> fa fa-bell</li>
                    <li><i class="fa fa-bell-o"></i> fa fa-bell-o</li>
                    <li><i class="fa fa-bolt"></i> fa fa-bolt</li>
                    <li><i class="fa fa-book"></i> fa fa-book</li>
                    <li><i class="fa fa-bookmark"></i> fa fa-bookmark</li>
                    <li><i class="fa fa-bookmark-o"></i> fa fa-bookmark-o</li>
                    <li><i class="fa fa-briefcase"></i> fa fa-briefcase</li>
                    <li><i class="fa fa-bullhorn"></i> fa fa-bullhorn</li>
                    <li><i class="fa fa-calendar"></i> fa fa-calendar</li>
                    <li><i class="fa fa-camera"></i> fa fa-camera</li>
                    <li><i class="fa fa-camera-retro"></i> fa fa-camera-retro</li>
                    <li><i class="fa fa-certificate"></i> fa fa-certificate</li>
                    <li><i class="fa fa-check"></i> fa fa-check</li>
                    <li><i class="fa fa-check-circle"></i> fa fa-check-circle</li>
                    <li><i class="fa fa-circle"></i> fa fa-circle</li>
                    <li><i class="fa fa-circle-o"></i> fa fa-circle-o</li>
                    <li><i class="fa fa-cloud"></i> fa fa-cloud</li>
                    <li><i class="fa fa-cloud-download"></i> fa fa-cloud-download</li>
                    <li><i class="fa fa-cloud-upload"></i> fa fa-cloud-upload</li>
                    <li><i class="fa fa-coffee"></i> fa fa-coffee</li>
                    <li><i class="fa fa-cog"></i> fa fa-cog</li>
                    <li><i class="fa fa-cogs"></i> fa fa-cogs</li>
                    <li><i class="fa fa-comment"></i> fa fa-comment</li>
                    <li><i class="fa fa-comment-o"></i> fa fa-comment-o</li>
                    <li><i class="fa fa-comments"></i> fa fa-comments</li>
                    <li><i class="fa fa-comments-o"></i> fa fa-comments-o</li>
                    <li><i class="fa fa-credit-card"></i> fa fa-credit-card</li>
                    <li><i class="fa fa-dashboard"></i> fa fa-dashboard</li>
                    <li><i class="fa fa-desktop"></i> fa fa-desktop</li>
                    <li><i class="fa fa-download"></i> fa fa-download</li>
                    <li><i class="fa fa-arrow-circle-down"></i> fa fa-arrow-circle-down</li>
                </ul>         
            </div>
            
            
            <div class="one_fourth">        
                <ul class="the-icons">
                    <li><i class="fa fa-edit"></i> fa fa-edit</li>
                    <li><i class="fa fa-envelope"></i> fa fa-envelope</li>
                    <li><i class="fa fa-envelope-o"></i> fa fa-envelope-o</li>
                    <li><i class="fa fa-exchange"></i> fa fa-exchange</li>
                    <li><i class="fa fa-exclamation-circle"></i> fa fa-exclamation-circle</li>
                    <li><i class="fa fa-external-link"></i> fa fa-external-link</li>
                    <li><i class="fa fa-eye-slash"></i> fa fa-eye-slash</li>
                    <li><i class="fa fa-eye"></i> fa fa-eye</li>
                    <li><i class="fa fa-video-camera"></i> fa fa-video-camera</li>
                    <li><i class="fa fa-fighter-jet"></i> fa fa-fighter-jet</li>
                    <li><i class="fa fa-film"></i> fa fa-film</li>
                    <li><i class="fa fa-filter"></i> fa fa-filter</li>
                    <li><i class="fa fa-fire"></i> fa fa-fire</li>
                    <li><i class="fa fa-flag"></i> fa fa-flag</li>
                    <li><i class="fa fa-folder"></i> fa fa-folder</li>
                    <li><i class="fa fa-folder-open"></i> fa fa-folder-open</li>
                    <li><i class="fa fa-folder-o"></i> fa fa-folder-o</li>
                    <li><i class="fa fa-folder-open-o"></i> fa fa-folder-open-o</li>
                    <li><i class="fa fa-cutlery"></i> fa fa-cutlery</li>
                    <li><i class="fa fa-gift"></i> fa fa-gift</li>
                    <li><i class="fa fa-glass"></i> fa fa-glass</li>
                    <li><i class="fa fa-globe"></i> fa fa-globe</li>
                    <li><i class="fa fa-group"></i> fa fa-group</li>
                    <li><i class="fa fa-hdd-o"></i> fa fa-hdd-o</li>
                    <li><i class="fa fa-headphones"></i> fa fa-headphones</li>
                    <li><i class="fa fa-heart"></i> fa fa-heart</li>
                    <li><i class="fa fa-heart-o"></i> fa fa-heart-o</li>
                    <li><i class="fa fa-home"></i> fa fa-home</li>
                    <li><i class="fa fa-inbox"></i> fa fa-inbox</li>
                    <li><i class="fa fa-info-circle"></i> fa fa-info-circle</li>
                    <li><i class="fa fa-key"></i> fa fa-key</li>
                    <li><i class="fa fa-leaf"></i> fa fa-leaf</li>
                    <li><i class="fa fa-laptop"></i> fa fa-laptop</li>
                    <li><i class="fa fa-legal"></i> fa fa-legal</li>
                    <li><i class="fa fa-lemon-o"></i> fa fa-lemon-o</li>
                    <li><i class="fa fa-lightbulb-o"></i> fa fa-lightbulb-o</li>
                    <li><i class="fa fa-lock"></i> fa fa-lock</li>
                    <li><i class="fa fa-unlock"></i> fa fa-unlock</li>
                </ul>        
            </div>
            
            
            <div class="one_fourth">        
                <ul class="the-icons">
                    <li><i class="fa fa-magic"></i> fa fa-magic</li>
                    <li><i class="fa fa-magnet"></i> fa fa-magnet</li>
                    <li><i class="fa fa-map-marker"></i> fa fa-map-marker</li>
                    <li><i class="fa fa-minus"></i> fa fa-minus</li>
                    <li><i class="fa fa-minus-circle"></i> fa fa-minus-circle</li>
                    <li><i class="fa fa-mobile-phone"></i> fa fa-mobile-phone</li>
                    <li><i class="fa fa-money"></i> fa fa-money</li>
                    <li><i class="fa fa-arrows-alt"></i> fa fa-arrows-alt</li>
                    <li><i class="fa fa-music"></i> fa fa-music</li>
                    <li><i class="fa fa-power-off"></i> fa fa-power-off</li>
                    <li><i class="fa fa-check-square"></i> fa fa-check-square</li>
                    <li><i class="fa fa-check-square-o"></i> fa fa-check-square-o</li>
                    <li><i class="fa fa-check-circle"></i> fa fa-check-circle</li>
                    <li><i class="fa fa-pencil"></i> fa fa-pencil</li>
                    <li><i class="fa fa-picture-o"></i> fa fa-picture-o</li>
                    <li><i class="fa fa-plane"></i> fa fa-plane</li>
                    <li><i class="fa fa-plus"></i> fa fa-plus</li>
                    <li><i class="fa fa-plus-circle"></i> fa fa-plus-circle</li>
                    <li><i class="fa fa-print"></i> fa fa-print</li>
                    <li><i class="fa fa-key"></i> fa fa-key</li>
                    <li><i class="fa fa-qrcode"></i> fa fa-qrcode</li>
                    <li><i class="fa fa-question-circle"></i> fa fa-question-circle</li>
                    <li><i class="fa fa-quote-left"></i> fa fa-quote-left</li>
                    <li><i class="fa fa-quote-right"></i> fa fa-quote-right</li>
                    <li><i class="fa fa-random"></i> fa fa-random</li>
                    <li><i class="fa fa-refresh"></i> fa fa-refresh</li>
                    <li><i class="fa fa-times-circle"></i> fa fa-times-circle</li>
                    <li><i class="fa fa-times-circle-o"></i> fa fa-times-circle-o</li>
                    <li><i class="fa fa-times"></i> fa fa-times</li>
                    <li><i class="fa fa-bars"></i> fa fa-bars</li>
                    <li><i class="fa fa-reply"></i> fa fa-reply</li>
                    <li><i class="fa fa-expand"></i> fa fa-expand</li>
                    <li><i class="fa fa-compress"></i> fa fa-compress</li>
                    <li><i class="fa fa-retweet"></i> fa fa-retweet</li>
                    <li><i class="fa fa-road"></i> fa fa-road</li>
                    <li><i class="fa fa-rss"></i> fa fa-rss</li>
                    <li><i class="fa fa-play-circle"></i> fa fa-play-circle</li>
                    <li><i class="fa fa-search"></i> fa fa-search</li>
                </ul>        
            </div>
            
            
            <div class="one_fourth last">        
                <ul class="the-icons">
                    <li><i class="fa fa-share"></i> fa fa-share</li>
                    <li><i class="fa fa-share-square"></i> fa fa-share-square</li>
                    <li><i class="fa fa-shopping-cart"></i> fa fa-shopping-cart</li>
                    <li><i class="fa fa-signal"></i> fa fa-signal</li>
                    <li><i class="fa fa-sign-in"></i> fa fa-sign-in</li>
                    <li><i class="fa fa-sign-out"></i> fa fa-sign-out</li>
                    <li><i class="fa fa-sitemap"></i> fa fa-sitemap</li>
                    <li><i class="fa fa-sort"></i> fa fa-sort</li>
                    <li><i class="fa fa-sort-down"></i> fa fa-sort-down</li>
                    <li><i class="fa fa-sort-up"></i> fa fa-sort-up</li>
                    <li><i class="fa fa-spinner"></i> fa fa-spinner</li>
                    <li><i class="fa fa-star"></i> fa fa-star</li>
                    <li><i class="fa fa-star-o"></i> fa fa-star-o</li>
                    <li><i class="fa fa-star-half"></i> fa fa-star-half</li>
                    <li><i class="fa fa-tablet"></i> fa fa-tablet</li>
                    <li><i class="fa fa-tag"></i> fa fa-tag</li>
                    <li><i class="fa fa-tags"></i> fa fa-tags</li>
                    <li><i class="fa fa-tasks"></i> fa fa-tasks</li>
                    <li><i class="fa fa-thumbs-down"></i> fa fa-thumbs-down</li>
                    <li><i class="fa fa-thumbs-up"></i> fa fa-thumbs-up</li>
                    <li><i class="fa fa-clock-o"></i> fa fa-clock-o</li>
                    <li><i class="fa fa-tint"></i> fa fa-tint</li>
                    <li><i class="fa fa-trash-o"></i> fa fa-trash-o</li>
                    <li><i class="fa fa-trophy"></i> fa fa-trophy</li>
                    <li><i class="fa fa-truck"></i> fa fa-truck</li>
                    <li><i class="fa fa-umbrella"></i> fa fa-umbrella</li>
                    <li><i class="fa fa-upload"></i> fa fa-upload</li>
                    <li><i class="fa fa-cloud-upload"></i> fa fa-cloud-upload</li>
                    <li><i class="fa fa-user"></i> fa fa-user</li>
                    <li><i class="fa fa-user-md"></i> fa fa-user-md</li>
                    <li><i class="fa fa-volume-off"></i> fa fa-volume-off</li>
                    <li><i class="fa fa-volume-down"></i> fa fa-volume-down</li>
                    <li><i class="fa fa-volume-up"></i> fa fa-volume-up</li>
                    <li><i class="fa fa-warning"></i> fa fa-warning</li>
                    <li><i class="fa fa-wrench"></i> fa fa-wrench</li>
                    <li><i class="fa fa-minus-square"></i> fa fa-minus-square</li>
                    <li><i class="fa fa-plus-square"></i> fa fa-plus-square</li>
                    <li><i class="fa fa-question-circle"></i> fa fa-question-circle</li>
                </ul>        
            </div>
            <!--/Font Awesome Icons -->
            
            
            
            
            <!-- Columns -->
            <h4 class="title-divider">Columns</h4>
            
            
            <div class="one_half">        
                <h4>One Half</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam vehicula condimentum. Donec non vulputate diam. Maecenas sed purus id quam dictum dictum ut eu tortor.</p>        
            </div>
            
            <div class="one_half last">
                <h4>One Half</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam vehicula condimentum. Donec non vulputate diam. Maecenas sed purus id quam dictum dictum ut eu tortor.</p>
            </div>
          
          
          
            <hr>
            
            
            
            <div class="one_third">        
                <h4 class="black">One Third</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam vehicula condimentum.</p>        
            </div>
            
            <div class="one_third">        
                <h4 class="black">One Third</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam vehicula condimentum.</p>        
            </div>
            
            <div class="one_third last">        
                <h4 class="black">One Third</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam vehicula condimentum.</p>        
            </div>
            
            
            
            <hr>
            
            
            
            <div class="one_fourth">        
                <h4 class="black">One Fourth</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam.</p>        
            </div>
            
            <div class="one_fourth">        
                <h4 class="black">One Fourth</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam.</p>        
            </div>
            
            <div class="one_fourth">        
                <h4 class="black">One Fourth</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam.</p>        
            </div>
            
            <div class="one_fourth last">        
                <h4 class="black">One Fourth</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae est sed quam.</p>        
            </div>
            
          
            
            <hr>
            
            
            
            <div class="one_fifth">        
                <h4 class="black">One Fifth</h4>
                <p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>        
            </div>
            
            <div class="one_fifth">        
                <h4 class="black">One Fifth</h4>
                <p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>        
            </div>
            
            <div class="one_fifth">        
                <h4 class="black">One Fifth</h4>
                <p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>        
            </div>
            
            <div class="one_fifth">        
                <h4 class="black">One Fifth</h4>
                <p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>        
            </div>
            
            <div class="one_fifth last">        
                <h4 class="black">One Fifth</h4>
                <p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>        
            </div>
            <!--/Columns -->
        
       
        
        </div>
        <!--/Container -->
    
    </section>
    <!--/Shortcodes -->    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    <!-- Footer -->
    <footer>
		<div class="container no-padding">
        	
            <a id="back-top"><div id="menu_top"><div id="menu_top_inside"></div></div></a>
            
            <ul class="socials-icons">
                <li><a href="#"><img src="images/facebook.png" alt="" /></a></li>
                <li><a href="#"><img src="images/twitter.png" alt="" /></a></li>
                <li><a href="#"><img src="images/google.png" alt="" /></a></li>
            </ul> 
            
			<p class="copyright">2013 &copy; newave. All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
            
		</div>
	</footer>
	<!--/Footer -->
    
    
    
    
    
    
    
    
    
    
    
    
	
	
    
	
	<script src='js/jquery.js'></script>
    <script src="js/jquery.sticky.js"></script>	
    <script src="js/styleswitcher.js" type="text/javascript"></script>    
	<script src="js/jquery.easing-1.3.pack.js" type="text/javascript"></script>
	<script src="js/bootstrap.min.js" type="text/javascript"></script>
	<script src="js/jquery.parallax-1.1.3.js" type="text/javascript"></script>
	<script src="js/appear.js" type="text/javascript" ></script>
	<script src="js/modernizr.js" type="text/javascript"></script>
	<script src="js/jquery.prettyPhoto.js" type="text/javascript"></script>
    <script src="js/isotope.js" type="text/javascript"></script>
    <script src="js/jquery.bxslider.min.js"></script>
    <script src="js/jquery.cycle.all.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/jquery.maximage.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/skrollr.js"></script>
    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>    
	<script src="js/scripts.js" type="text/javascript"></script>
    
    
	
	
	</body>
</html>